<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="canss.supports.basic"%>
<%@page import="canss.encoder.DBStringEncoder"%>
<%@ page import="java.sql.*"%>
<!-- Initiation -->
<%
	response.setContentType("text/html; charset=UTF-8");
%>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta content="ko" http-equiv="Content-Language" />
<title>KAIST-CANSS</title>
<link href="design/mainframe.css" rel="stylesheet" type="text/css" />
<link href="design/forms.css" rel="stylesheet" type="text/css" />
<link href="design/content.css" rel="stylesheet" type="text/css" />
<link href="design/layout.css" rel="stylesheet" type="text/css" />

<!-- Preparing inputs -->
<%
	String _debug = basic.IIf((String) session.getAttribute("_debug"), ""); //cp,so,3rd

	String _loginedas = basic.IIf((String) session.getAttribute("_loginedas"), ""); //cp,so,3rd
	final String LOGINEDASCP = "cp";
	final String LOGINEDASSO = "so";
	final String LOGINEDAS3RD = "3rd";
	String _pid = basic.IIf((String) session.getAttribute("_pid"), ""); //cp,so,3rd
	String _name = basic.IIf((String) session.getAttribute("_name"), ""); //cp,so,3rd
	String _sessionkey = basic.IIf((String) session.getAttribute("_sessionkey"), ""); //cp,so,3rd
	String _key = basic.IIf((String) session.getAttribute("_key"), ""); //key
	int _pagenum = Integer.valueOf(basic.IIf(request.getParameter("_pagenum"), "0").trim());

	String locstr = "Home"; /*do not delete it*/
%>

<!-- Initialize scripts -->
<script type="text/javascript" src="lib/httpobject.js"></script>
<script type="text/javascript" src="lib/generals.js"></script>
<script type="text/javascript" src="lib/cidstatus.js"></script>
<script type="text/javascript" src="lib/piclens.js"></script>
<script type="text/javascript" src="lib/refresh.js"></script>
<script type="text/javascript" src="lib/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="lib/jquery.ui-1.6.4.js"></script>
<script type="text/javascript" src="lib/jquery.form.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
</head>

<body>
<!-- Initialize session & login control -->
<%
	session = request.getSession(true);
	session.setMaxInactiveInterval(1800/*30분*/);
	response.setContentType("text/html; charset=UTF-8");
	canss.webservice.service.LoginControl login = null;
	login = (login == null) ? new canss.webservice.service.LoginControlBean() : login;
%>
<!-- Login & Check Progress -->
<%
	//_loginedas
	boolean _is_first = false;
	boolean logintest_succeed = false;
	if (basic.isEmpty(_loginedas) && basic.isEmpty(_debug))
	{
		if (login.logincheckForCP(_pid, _sessionkey))
		{//for cp
			logintest_succeed = true;
			_loginedas = LOGINEDASCP;
			session.setAttribute("_loginedas", LOGINEDASCP);
			session.setAttribute("_admin", "user");
			if (_pagenum == 0)
				_pagenum = 13;
		} else if (login.logincheckForOP(_pid, _sessionkey))
		{//for op
			logintest_succeed = true;
			_loginedas = LOGINEDASSO;
			session.setAttribute("_loginedas", LOGINEDASSO);
			session.setAttribute("_admin", "admin");
			if (_pagenum == 0)
				_pagenum = 12;
		} else if (login.logincheckForThird(_pid, _sessionkey))
		{//for 3rd
			logintest_succeed = true;
			_loginedas = LOGINEDAS3RD;
			session.setAttribute("_loginedas", LOGINEDAS3RD);
			session.setAttribute("_admin", "user");
			if (_pagenum == 0)
				_pagenum = 14;
		} else
		{//if else
			logintest_succeed = false;
			_pagenum = 0;
		}
		_is_first = true;
	} else if (_loginedas.equalsIgnoreCase(LOGINEDASCP))
	{
		logintest_succeed = login.logincheckForCP(_pid, _sessionkey);
	} else if (_loginedas.equalsIgnoreCase(LOGINEDASSO))
	{
		logintest_succeed = login.logincheckForOP(_pid, _sessionkey);
	} else if (_loginedas.equalsIgnoreCase(LOGINEDAS3RD))
	{
		logintest_succeed = login.logincheckForThird(_pid, _sessionkey);
	} else
		logintest_succeed = false;//do failing

	if (!logintest_succeed && basic.isEmpty(_debug))
	{//login failed --(forwarding)--> index.jsp
		response.sendRedirect(response.encodeRedirectURL("index.jsp?loginfailed"));
		return;
	}
%>

<!-- Includes basic components -->
<%@include file="components/main_welcome.jsp"%>
<%@include file="components/main_status.jsp"%>
<%@include file="components/main_leftmenu.jsp"%>

<!-- divs start -->
<!-- loading image divs -->
<div id="overlay2"
	style="z-index: 150; position: absolute; width: 100%; display: none; height: 100%; top: 0px; left: 0px;"><img
	width="40" height="40" id="loadingImage" style="position: absolute; top: 50%; left: 50%;" src="design/img/loading.gif"
	complete="complete" /></div>
<div id="overlay3" style="display: none;"><img width="20" height="20" src="design/img/loading.gif" /></div>
<!-- result page divs -->
<div id="divbodywrap">
<div id="divbody1"></div>
<!-- external scripts include start --> <%
 	switch (_pagenum)
 	{
 	case 13:
 %>
<div style="">
<ol>
	<div class="formSeparator">
	<h2>Chart view</h2>
	</div>

	<ul class="d_board_divlist" style="display: block; width: 500px;">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Traffic per Content in Date order</h3>
		<div id="trafficNcount"></div>
		</li>
	</ul>
	<ul class="d_board_divlist">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Total Content Playing Error ratio</h3>
		<div id="health_ratio"></div>
		</div>
		</li>
	</ul>
	<ul class="d_board_divlist">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Average Content Play time</h3>
		<div id="playedtime_ratio"></div>
		</div>
		</li>
	</ul>
</ol>
</div>
<form id='frm_contentsdetailfromchart' action='' method='post'><input type='hidden' name='_cid'
	id='frm_contentsdetailfromchart_cid' value='' /> <input type='hidden' name='_div' value='' /></form>
<link rel="stylesheet" type="text/css" href="design/main_div.css" />
<!-- Statu board start --> <%
	//vars [data_total_stat]
	String data_total_stat_cp = "";
	{// load
		java.net.URL u = new java.net.URL(canss.supports.basic.HOST_URL + "components/data/data_total_stat_cp.jsp?_pid="+_pid);
		java.net.URLConnection uc = (java.net.URLConnection) u.openConnection();
		uc.setDoOutput(false);
		uc.setDoInput(true);
		java.io.BufferedReader in = new java.io.BufferedReader(new java.io.InputStreamReader(uc.getInputStream()));
		String inputLine;
		while ((inputLine = in.readLine()) != null)
			data_total_stat_cp += (inputLine);
		in.close();
	}
	//vars [data_day_stat]
	String data_day_stat_cp = "";
	{// load
		java.net.URL u = new java.net.URL(canss.supports.basic.HOST_URL + "components/data/data_day_stat_cp.jsp?_pid="+_pid);
		java.net.URLConnection uc = (java.net.URLConnection) u.openConnection();
		uc.setDoOutput(false);
		uc.setDoInput(true);
		java.io.BufferedReader in = new java.io.BufferedReader(new java.io.InputStreamReader(uc.getInputStream()));
		String inputLine;
		while ((inputLine = in.readLine()) != null)
			data_day_stat_cp += (inputLine);
		in.close();
	}
 		
 %> <script type="text/javascript">
	var data_total_stat_cp = <%=data_total_stat_cp%>;
	var data_day_stat_cp = <%=data_day_stat_cp%>;

	function viz_trafficNcount() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'Name');
	  data.addColumn('number', 'count');
	  data.addColumn('number', 'traffic\n(log(MB))');
	  
	  data.addRows(Math.min(25,data_day_stat_cp[1].length));
	 	for(i=0; i<Math.min(25,data_day_stat_cp[1].length); i++)
	  {
	  	data.setCell(i, 0, data_day_stat_cp[1][i][0]);
	  	data.setCell(i, 1, data_day_stat_cp[1][i][1][0][1]);
	  	data.setCell(i, 2, Math.log(data_day_stat_cp[1][i][1][1][1]));
	  }
	  // Create and draw the visualization.
	  var c = new google.visualization.LineChart(document.getElementById('trafficNcount'));
	  c.draw(data, {width:550, height:300, legendFontSize:12, backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9', pointSize: 5});
	  
	  google.visualization.events.addListener(c, 'select', function() {
	    var selection = c.getSelection();
	    var message = '';
		  for (var i = 0; i < selection.length; i++) {
		    var item = selection[i];
		    message += data.getFormattedValue(item.row, 0);
		  }
		  if (message == '') {
		    message = 'nothing';
		  }
		  //alert(message);
		  
		  var frm=getobj('frm_contentsdetailfromchart');
		  if(frm)
		  {
		  	getobj('frm_contentsdetailfromchart_cid').value=message;
		  	window.open('','pop_contentsdetailfromchart','width=380,height=360');
		  	frm.action='testplayer/content_testview.jsp';
		  	frm.method='get';
		  	frm.target='pop_contentsdetailfromchart';
		  	frm.submit();
		  }
	  });
	}
	function viz_health_ratio() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'name');
	  data.addColumn('number', 'ratio');
	  data.addRows(data_total_stat_cp[0]);
	
	  // Create and draw the visualization.
	  new google.visualization.BarChart(document.getElementById('health_ratio'))
	    .draw(data, {width:300, height:30, max:100, min:0, color:'ff0000', backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9'});
	}
	function viz_playedtime_ratio() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'name');
	  data.addColumn('number', 'ratio');
	  data.addRows(data_total_stat_cp[4]);
	
	  // Create and draw the visualization.
	  new google.visualization.BarChart(document.getElementById('playedtime_ratio'))
	    .draw(data, {width:300, height:30, max:1, min:0, color:'ff0000', backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9'});
	}
</script> <script type="text/javascript">
	// Load the Visualization API and the piechart package.
	google.load('visualization', '1', {'packages':['piechart','barchart','linechart']});
	// Set a callback to run when the Google Visualization API is loaded.
  google.setOnLoadCallback(viz_trafficNcount);
  google.setOnLoadCallback(viz_health_ratio);
  google.setOnLoadCallback(viz_playedtime_ratio);
</script>

<%
	break;
	case 12:
%>
<div style="">
<ol>
	<div class="formSeparator">
	<h2>Chart view</h2>
	</div>

	<ul class="d_board_divlist" style="display: block; width: 500px;">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Sites using our contents</h3>
		<div id="csreferer"></div>
		</div>
		</li>
	</ul>
	<ul class="d_board_divlist">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Total Content Playing Error ratio</h3>
		<div id="health_ratio"></div>
		</div>
		</li>

		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Portal Storage Status (KB)</h3>
		<div id="portalstorage"></div>
		</div>
		</li>
	</ul>
	<ul class="d_board_divlist">
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px">
		<h3>Average Content Play time</h3>
		<div id="playedtime_ratio"></div>
		</div>
		</li>
		<li class="d_board_divlist_vertical">
		<div class="info-group" style="border: 1px;">
		<h3>Traffic per Content in Date order</h3>
		<div id="trafficNcount"></div>
		</div>
		</li>
	</ul>
</ol>
</div>
<form id='frm_contentsdetailfromchart' action='' method='post'><input type='hidden' name='_cid'
	id='frm_contentsdetailfromchart_cid' value='' /> <input type='hidden' name='_div' value='' /></form>
<link rel="stylesheet" type="text/css" href="design/main_div.css" />
<!-- Statu board start --> <%
 	//vars [data_total_stat]
 		String data_total_stat = "";
 		{// load
 			java.net.URL u = new java.net.URL(canss.supports.basic.HOST_URL + "components/data/data_total_stat.jsp");
 			java.net.URLConnection uc = (java.net.URLConnection) u.openConnection();
 			uc.setDoOutput(false);
 			uc.setDoInput(true);
 			java.io.BufferedReader in = new java.io.BufferedReader(new java.io.InputStreamReader(uc.getInputStream()));
 			String inputLine;
 			while ((inputLine = in.readLine()) != null)
 				data_total_stat += (inputLine);
 			in.close();
 		}
 		//vars [data_day_stat]
 		String data_day_stat = "";
 		{// load
 			java.net.URL u = new java.net.URL(canss.supports.basic.HOST_URL + "components/data/data_day_stat.jsp");
 			java.net.URLConnection uc = (java.net.URLConnection) u.openConnection();
 			uc.setDoOutput(false);
 			uc.setDoInput(true);
 			java.io.BufferedReader in = new java.io.BufferedReader(new java.io.InputStreamReader(uc.getInputStream()));
 			String inputLine;
 			while ((inputLine = in.readLine()) != null)
 				data_day_stat += (inputLine);
 			in.close();
 		}
 		//vars [mediastoragedata_mm/mediastoragedata_mf]
 		String[] mediastoragedata_mm = null;
 		String[] mediastoragedata_mf = null;
 		{// load
 			java.net.URL u = new java.net.URL("http://mediator.canss.net/ServiceManager/reportStorageStatus.php");
 			java.net.URLConnection uc = (java.net.URLConnection) u.openConnection();
 			uc.setDoInput(true);
 			java.io.BufferedReader in = new java.io.BufferedReader(new java.io.InputStreamReader(uc.getInputStream()));
 			String msg = "";
 			String inputLine;
 			while ((inputLine = in.readLine()) != null)
 				msg += inputLine;
 			in.close();
 			String[] m = msg.split("<br/>");
 			mediastoragedata_mm = m[0].split(",");
 			mediastoragedata_mf = m[1].split(",");
 		}
 %> <script type="text/javascript">
	var data_total_stat = <%=data_total_stat%>;
	var data_day_stat = <%=data_day_stat%>;

	
	function viz_csreferer()
	{
		var data = new google.visualization.DataTable();
		data.addColumn('string', 'string');
		data.addColumn('number', 'counts');
		
		data.addRows( data_total_stat[1] );
		
		new google.visualization.PieChart(document.getElementById('csreferer'))
			.draw(data, {width: 550, height: 150, is3D: true, pieJoinAngle: 30, pieMinimalAngle: 5, legend: 'left', legendFontSize: 13, backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9'});
	}
	function viz_health_ratio() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'name');
	  data.addColumn('number', 'ratio');
	  data.addRows(data_total_stat[0]);
	
	  // Create and draw the visualization.
	  new google.visualization.BarChart(document.getElementById('health_ratio'))
	    .draw(data, {width:300, height:30, max:100, min:0, color:'ff0000', backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9'});
	}
	function viz_playedtime_ratio() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'name');
	  data.addColumn('number', 'ratio');
	  data.addRows(data_total_stat[4]);
	
	  // Create and draw the visualization.
	  new google.visualization.BarChart(document.getElementById('playedtime_ratio'))
	    .draw(data, {width:300, height:30, max:1, min:0, color:'ff0000', backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9'});
	}
	function viz_trafficNcount() 
	{
	  // Create and populate the data table.
	  var data = new google.visualization.DataTable();
	  data.addColumn('string', 'Name');
	  data.addColumn('number', 'count');
	  data.addColumn('number', 'traffic\n(log(MB))');
	  
	  data.addRows(Math.min(10,data_day_stat[1].length));
	 	for(i=0; i<Math.min(10,data_day_stat[1].length); i++)
	  {
	  	data.setCell(i, 0, data_day_stat[1][i][0]);
	  	data.setCell(i, 1, data_day_stat[1][i][1][0][1]);
	  	data.setCell(i, 2, Math.log(data_day_stat[1][i][1][1][1]));
	  }
	  // Create and draw the visualization.
	  var c = new google.visualization.LineChart(document.getElementById('trafficNcount'));
	  c.draw(data, {width:300, height:300, legendFontSize:12, backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9', pointSize: 5});
	  
	  google.visualization.events.addListener(c, 'select', function() {
	    var selection = c.getSelection();
	    var message = '';
		  for (var i = 0; i < selection.length; i++) {
		    var item = selection[i];
		    message += data.getFormattedValue(item.row, 0);
		  }
		  if (message == '') {
		    message = 'nothing';
		  }
		  //alert(message);
		  
		  var frm=getobj('frm_contentsdetailfromchart');
		  if(frm)
		  {
		  	getobj('frm_contentsdetailfromchart_cid').value=message;
		  	window.open('','pop_contentsdetailfromchart','width=380,height=360');
		  	frm.action='testplayer/content_testview.jsp';
		  	frm.method='get';
		  	frm.target='pop_contentsdetailfromchart';
		  	frm.submit();
		  }
	  });
	}
	function viz_portalstorage()
	{
		var data = new google.visualization.DataTable();
		data.addColumn('string', 'Status');
		data.addColumn('number', 'Counts');
		data.addRows([
			 ['Farm Used', <%=mediastoragedata_mf[2]%> ],
			 ['Farm Available', <%=mediastoragedata_mf[3]%> ],
			 ['Encoder Used', <%=mediastoragedata_mm[2]%> ],
			 ['Encoder Available', <%=mediastoragedata_mm[3]%> ]
			]);		
		new google.visualization.PieChart(document.getElementById('portalstorage'))
			.draw(data, {width: 350, height: 300, is3D: true, legend: 'bottom', backgroundColor: '#f9f9f9', legendBackgroundColor: '#f9f9f9', legendFontSize: 12});
		
	}
</script> <script type="text/javascript">
	// Load the Visualization API and the piechart package.
	google.load('visualization', '1', {'packages':['piechart','barchart','linechart']});
	// Set a callback to run when the Google Visualization API is loaded.
  google.setOnLoadCallback(viz_health_ratio);
  google.setOnLoadCallback(viz_csreferer);
  google.setOnLoadCallback(viz_playedtime_ratio);
  google.setOnLoadCallback(viz_trafficNcount);
  google.setOnLoadCallback(viz_portalstorage);
</script> <!-- Statu board end --> <%
 	break;
 	}
 %> <!-- external scripts include end -->
<div id="divbody2"></div>
</div>
<!-- divs end -->
<!-- script start -->
<script type="text/javascript">
			<!-- internal scripts -->
			if(<%=_is_first%>)
			{
				$(document).ready(function()
				{
			  	$("#divmenucp").hide("blind");
			  	$("#divmenuso").hide("blind");
			  	$("#divmenutr").hide("blind");
			  	$("#divmenueu").hide("blind");
				});
			}else
			{
				$("#divmenucp").hide();
		  	$("#divmenuso").hide();
		  	$("#divmenutr").hide();
		  	$("#divmenueu").hide();
			}
			<!-- internal functions -->
			function reloadpage()
			{
				self.location.reload();
			}
			function dologout()
			{
				location.href='logout.jsp?_rurl=index.jsp';
			}
			<!-- external scripts -->
			<%@include file="components/lib/main_script_menu.js"%>
		</script>
<!-- script end -->
</body>
</html>
